<template>
  <div>
    <!-- 查看详情（车队用） 2018/3/7 11:44 zhangQ -->
    <tablePage ref="subOrderTab" :staticData="subOrderData" :isStartLoad="false" :mode="1">
      <template slot-scope="props">
        <Table :columns="subOrderColumn" border :data="props.data" @on-sort-change="props.sortChange"></Table>
      </template>
    </tablePage>
    <xlinkModal v-model="operatModal.uploadPoundShow" title="上传榜单" className="vertical-center-modal">
      <uploadPound v-if="operatModal.uploadPoundShow" :currentSubOrder="currentSubOrder" @close="uploadPoundSucceed"></uploadPound>
    </xlinkModal>
  </div>
</template>

<script>
  import { getSubOrderListByMainOrderNo } from '@api/backEnd/fleetControl'
  import tablePage from '@components/table/tablePage.vue'
  import xlinkModal from '@components/modal/xlinkModal'
  import uploadPound from './uploadPound'

  export default {
    name: 'view-detail-for-fleet',
    data () {
      let subOrderColumn = [
        {
          title: '子运单号',
          key: 'orderNO',
          width: 250
        },
        {
          title: '箱号',
          key: 'container_no',
          width: 200
        },
        {
          title: '货票号',
          key: 'waybill_no',
          width: 200
        },
        {
          title: '司机姓名',
          width: 200,
          render: (h, params) => {
            return (<span title={params.row.driver_name}>{params.row.driver_name}</span>)
          }
        },
        {
          title: '车牌号',
          width: 100,
          key: 'truck_plate'
        },
        {
          title: '车队名称',
          width: 150,
          key: 'fleet_name'
        },
        {
          title: '司机拉运时间',
          width: 250,
          key: 'bind_time'
        },
        {
          title: '矿发吨数',
          width: 100,
          key: 'send_weight'
        },
        {
          title: '电厂净重',
          width: 100,
          key: 'net_weight'
        },
        {
          title: '磅单编号',
          width: 100,
          key: 'pound_no'
        },
        {
          title: '上传磅单时间',
          width: 250,
          key: 'upload_pound_time'
        },
        {
          title: '送货地址',
          width: 150,
          render: (h, params) => {
            return (<span title={params.row.shipping_address}>{params.row.shipping_address}</span>)
          }
        },
        {
          title: '上传磅单',
          key: 'action',
          align: 'center',
          width: 150,
          render: (h, params) => {
            let truckPlate = params.row.truck_plate
            let poundNo = params.row.pound_no
            if (truckPlate !== '----' && truckPlate !== '' && !poundNo) {
              let poundNoBtn = (<i-button type="primary" size="small" style="margin-right: 5px;" onClick={() => this.poundNoAction(params.row)}>上传磅单</i-button>)
              return [poundNoBtn]
            }
          }
        }
      ]
      let subOrderData = []
      let operatModal = { uploadPoundShow: false }
      let currentSubOrder = {}
      let datas = { subOrderColumn, subOrderData, operatModal, currentSubOrder }
      return datas
    },
    props: {
      currentMainOrder: {
        type: Object,
        default () {
          return {}
        }
      }
    },
    computed: {},
    methods: {
      getSubOrderData () {
        if (!(this.currentMainOrder && this.currentMainOrder.orderNo)) {
          return
        }
        let param = {
          mainOrderNo: this.currentMainOrder.orderNo
        }
        getSubOrderListByMainOrderNo(param).then(res => {
          if (res.data.isSuccess === 1) {
            this.subOrderData = res.data.data
          } else {
            Promise.reject(new Error(res.data.res))
          }
        }).catch((err) => {
          console.log('接口getOrderDetail:' + err)
        })
      },
      poundNoAction (row) {
        this.currentSubOrder = row
        this.operatModal.uploadPoundShow = true
      },
      uploadPoundSucceed (tarStr) {
        this.operatModal.uploadPoundShow = false
        if (tarStr === 'uploadPound') {
          this.getSubOrderData()
        }
      }
    },
    mounted () {
      this.getSubOrderData()
    },
    components: { xlinkModal, uploadPound, tablePage }
  }
</script>

<style scoped>

</style>
